<template>
  <view class="normal-login-container">
    <view class="logo-content align-center justify-center flex">
      <image style="width: 100rpx;height: 100rpx;" :src="globalConfig.appInfo.logo" mode="widthFix">
      </image>
      <text class="title">星火大模型语义-工作任务分析</text>
    </view>
    <view class="login-form-content">
      <view>
        <textarea v-model="chatContent" type="text" placeholder="请输入聊天内容" style="border: solid grey 1px; text-align: left;"></textarea>
      </view>
      <view class="action-btn">
        <button @click="aiTaskAnalysis" class="login-btn cu-btn block bg-blue lg round">开始分析</button>
        <button @click="goDebug" class="login-btn cu-btn block bg-blue lg round">进入调试</button>
      </view>

      <view class="help-container">
        <view v-for="(item, id) in list" :key="id" :title="item.taskname" class="list-title">
          <view class="text-title">
            <view class="text-item">日期时间：{{ item.taskDate }} {{ item.taskTime }}</view>
            <view class="text-item">需要做什么：{{ item.taskMemo }}</view>
            <view class="text-item">参与人员：{{ item.taskUserlist }}</view>
            <view class="text-item">关键词：{{ item.taskKeyword }}</view>
          </view>
          <view class="line">---------------------------------------------</view>
        </view>
      </view>

      <view class="reg text-center" v-if="register">
        <text class="text-grey1">没有账号？</text>
        <text @click="handleUserRegister" class="text-blue">立即注册</text>
      </view>
      <view class="xieyi text-center" v-if="false">
        <text class="text-grey1">登录即代表同意</text>
        <text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
        <text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
      </view>
    </view>

  </view>
</template>

<script>
  import { getCodeImg } from '@/api/login'
  import { taskAnalysis } from '@/api/system/user'

  export default {
    data() {
      return {
        list:[],
        codeUrl: "",
        captchaEnabled: true,
        // 用户注册开关
        register: false,
        chatContent: "本周五 下午，@sisi @一起去一下老板办公室。下周三下午两点，@sisi @王老板参加开发会议。下周一上午9点我有一个金典面试 ",
        globalConfig: getApp().globalData.config,
        loginForm: {
          username: "admin",
          password: "admin123",
          code: "",
          uuid: ''
        }
      }
    },
    created() {
      this.getCode()
    },
    methods: {
      // 密码大模型任务分析
      async aiTaskAnalysis() {
        const that = this;
        that.list = [];
        uni.showLoading({
          title: '语义分析中...',
        });

        taskAnalysis({content: this.chatContent}).then(response => {
          console.log(response);
          that.list = response.data;
          uni.hideLoading();
        }).catch((err) => {
          console.log(err);
          uni.hideLoading();
          uni.showLoading({
            title: '语义二次分析中...',
          });
          //分析二次
          taskAnalysis({content: this.chatContent}).then(response => {
            console.log(response);
            that.list = response.data;
            uni.hideLoading();
          }).catch((err) => {
            console.log(err);
            uni.hideLoading();
          })

        })
      },
      // 用户注册
      handleUserRegister() {
        this.$tab.redirectTo(`/pages/register`)
      },
      // 用户注册
      goDebug() {
        this.$tab.redirectTo(`/pages/login_debug`)
      },
      // 隐私协议
      handlePrivacy() {
        let site = this.globalConfig.appInfo.agreements[0]
        this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
      },
      // 用户协议
      handleUserAgrement() {
        let site = this.globalConfig.appInfo.agreements[1]
        this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
      },
      // 获取图形验证码
      getCode() {
        getCodeImg().then(res => {
          this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
          if (this.captchaEnabled) {
            this.codeUrl = 'data:image/gif;base64,' + res.img
            this.loginForm.uuid = res.uuid
          }
        })
      },
      // 登录方法
      async handleLogin() {
        if (this.loginForm.username === "") {
          this.$modal.msgError("请输入您的账号")
        } else if (this.loginForm.password === "") {
          this.$modal.msgError("请输入您的密码")
        } else if (this.loginForm.code === "" && this.captchaEnabled) {
          this.$modal.msgError("请输入验证码")
        } else {
          this.$modal.loading("登录中，请耐心等待...")
          this.pwdLogin()
        }
      },
      // 密码登录
      async pwdLogin() {
        this.$store.dispatch('Login', this.loginForm).then(() => {
          this.$modal.closeLoading()
          this.loginSuccess()
        }).catch(() => {
          if (this.captchaEnabled) {
            this.getCode()
          }
        })
      },
      // 登录成功后，处理函数
      loginSuccess(result) {
        // 设置用户信息
        this.$store.dispatch('GetInfo').then(res => {
          this.$tab.reLaunch('/pages/index')
        })
      }
    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }

  .normal-login-container {
    width: 100%;

    .logo-content {
      width: 100%;
      font-size: 21px;
      text-align: center;
      padding-top: 15%;

      image {
        border-radius: 4px;
      }

      .title {
        margin-left: 10px;
      }
    }

    .login-form-content {
      text-align: center;
      margin: 20px auto;
      margin-top: 15%;
      width: 80%;

      .input-item {
        margin: 20px auto;
        background-color: #f5f6f7;
        height: 45px;
        border-radius: 20px;

        .icon {
          font-size: 38rpx;
          margin-left: 10px;
          color: #999;
        }

        .input {
          width: 100%;
          font-size: 14px;
          line-height: 20px;
          text-align: left;
          padding-left: 15px;
        }

      }

      .login-btn {
        margin-top: 40px;
        height: 45px;
      }

      .reg {
        margin-top: 15px;
      }

      .xieyi {
        color: #333;
        margin-top: 20px;
      }

      .login-code {
        height: 38px;
        float: right;

        .login-code-img {
          height: 38px;
          position: absolute;
          margin-left: 10px;
          width: 200rpx;
        }
      }
    }
  }

</style>
<style lang="scss" scoped>
  page {
    background-color: #f8f8f8;
  }

  .help-container {
    text-align: left;
    margin-bottom: 100rpx;
    padding: 30rpx;
  }

  .list-title {
    margin-bottom: 30rpx;
  }

  .childList {
    background: #ffffff;
    box-shadow: 0px 0px 10rpx rgba(193, 193, 193, 0.2);
    border-radius: 16rpx;
    margin-top: 10rpx;
  }

  .line {
    width: 100%;
    height: 1rpx;
    background-color: #F5F5F5;
  }

  .text-title {
    color: #303133;
    font-size: 32rpx;
    /*font-weight: bold;*/
    margin-left: 10rpx;

    .iconfont {
      font-size: 16px;
      margin-right: 10rpx;
    }
  }

  .text-item {
    font-size: 28rpx;
    padding: 24rpx;
    border: grey solid 1px;
  }

  .question {
    color: #606266;
    font-size: 28rpx;
  }
</style>
